/**
 * 地图显示组件
 * 用于显示商家位置，支持地图交互和导航功能
 */

import { LocationHelper, LocationInfo } from '../../utils/location-helper';

Component({
  properties: {
    // 纬度
    latitude: {
      type: Number,
      value: 39.9042
    },
    // 经度
    longitude: {
      type: Number,
      value: 116.4074
    },
    // 地址信息
    addressInfo: {
      type: Object,
      value: null
    },
    // 地图缩放级别
    scale: {
      type: Number,
      value: 16
    },
    // 是否显示当前位置
    showLocation: {
      type: Boolean,
      value: true
    },
    // 是否显示控件
    showControls: {
      type: Boolean,
      value: true
    },
    // 是否显示地址卡片
    showAddressCard: {
      type: Boolean,
      value: true
    },
    // 是否显示操作按钮
    showActions: {
      type: Boolean,
      value: true
    },
    // 地图高度
    height: {
      type: String,
      value: '300px'
    }
  },

  data: {
    markers: [] as any[],
    loading: false,
    loadingText: '加载中...',
    mapContext: null as any
  },

  lifetimes: {
    attached() {
      this.initMap();
    },

    ready() {
      // 创建地图上下文
      this.data.mapContext = wx.createMapContext('merchantMap', this);
      this.updateMarkers();
    }
  },

  observers: {
    'latitude, longitude': function(lat: number, lng: number) {
      if (lat && lng) {
        this.updateMarkers();
      }
    }
  },

  methods: {
    /**
     * 初始化地图
     */
    initMap() {
      console.log('地图组件初始化');
      this.updateMarkers();
    },

    /**
     * 更新地图标记
     */
    updateMarkers() {
      const { latitude, longitude, addressInfo } = this.properties;
      
      if (!latitude || !longitude) {
        return;
      }

      const markers = [{
        id: 1,
        latitude: latitude,
        longitude: longitude,
        width: 30,
        height: 30,
        title: addressInfo?.name || '商家位置',
        callout: {
          content: addressInfo?.name || '商家位置',
          color: '#333',
          fontSize: 14,
          borderRadius: 6,
          bgColor: '#fff',
          padding: 8,
          display: 'ALWAYS'
        }
      }];

      this.setData({
        markers: markers
      });
    },

    /**
     * 地图点击事件
     */
    onMapTap(e: any) {
      console.log('地图点击:', e.detail);
      this.triggerEvent('mapTap', e.detail);
    },

    /**
     * 标记点击事件
     */
    onMarkerTap(e: any) {
      console.log('标记点击:', e.detail);
      this.triggerEvent('markerTap', e.detail);
    },

    /**
     * 地图区域变化
     */
    onRegionChange(e: any) {
      console.log('地图区域变化:', e.detail);
      this.triggerEvent('regionChange', e.detail);
    },

    /**
     * 放大地图
     */
    zoomIn() {
      // 开发者工具不支持此API，静默处理
      console.log('放大地图（真机可用）');
      wx.showToast({
        title: '请在真机上测试',
        icon: 'none',
        duration: 1500
      });
    },

    /**
     * 缩小地图
     */
    zoomOut() {
      // 开发者工具不支持此API，静默处理
      console.log('缩小地图（真机可用）');
      wx.showToast({
        title: '请在真机上测试',
        icon: 'none',
        duration: 1500
      });
    },

    /**
     * 移动到当前位置
     */
    async moveToCurrentLocation() {
      try {
        this.setData({
          loading: true,
          loadingText: '正在获取当前位置...'
        });

        const currentLocation = await LocationHelper.getCurrentLocation(true);
        
        if (this.data.mapContext) {
          this.data.mapContext.moveToLocation({
            latitude: currentLocation.latitude,
            longitude: currentLocation.longitude,
            scale: 16
          });
        }

        this.setData({
          loading: false
        });

        // 触发位置变化事件
        this.triggerEvent('locationChange', currentLocation);

      } catch (error) {
        this.setData({
          loading: false
        });
        
        wx.showToast({
          title: error instanceof Error ? error.message : '获取位置失败',
          icon: 'none'
        });
      }
    },

    /**
     * 在微信地图中打开
     */
    openInWechatMap() {
      const { latitude, longitude, addressInfo } = this.properties;
      
      if (!latitude || !longitude) {
        wx.showToast({
          title: '位置信息不完整',
          icon: 'none'
        });
        return;
      }

      wx.openLocation({
        latitude: latitude,
        longitude: longitude,
        name: addressInfo?.name || '商家位置',
        address: addressInfo?.address || '',
        scale: 16
      });
    },

    /**
     * 复制地址
     */
    copyAddress() {
      const address = this.properties.addressInfo?.address;
      
      if (!address) {
        wx.showToast({
          title: '暂无地址信息',
          icon: 'none'
        });
        return;
      }

      wx.setClipboardData({
        data: address,
        success: () => {
          wx.showToast({
            title: '地址已复制',
            icon: 'success'
          });
        },
        fail: () => {
          wx.showToast({
            title: '复制失败',
            icon: 'none'
          });
        }
      });
    },

    /**
     * 导航到位置
     */
    navigateToLocation() {
      const { latitude, longitude, addressInfo } = this.properties;
      
      if (!latitude || !longitude) {
        wx.showToast({
          title: '位置信息不完整',
          icon: 'none'
        });
        return;
      }

      // 使用微信内置导航
      wx.openLocation({
        latitude: latitude,
        longitude: longitude,
        name: addressInfo?.name || '目的地',
        address: addressInfo?.address || '',
        scale: 16
      });
    },

    /**
     * 移动地图到指定位置
     */
    moveToLocation(latitude: number, longitude: number, scale?: number) {
      if (this.data.mapContext) {
        this.data.mapContext.moveToLocation({
          latitude: latitude,
          longitude: longitude,
          scale: scale || this.properties.scale
        });
      }
    },

    /**
     * 获取地图中心点
     */
    getCenterLocation(): Promise<{latitude: number, longitude: number}> {
      return new Promise((resolve, reject) => {
        if (this.data.mapContext) {
          this.data.mapContext.getCenterLocation({
            success: (res: any) => {
              resolve({
                latitude: res.latitude,
                longitude: res.longitude
              });
            },
            fail: reject
          });
        } else {
          reject(new Error('地图上下文未初始化'));
        }
      });
    }
  }
});
